/*
 * @Author: 小胖沱 1643200914@qq.com
 * @Date: 2022-12-15 14:20:25
 * @LastEditors: 小胖沱 1643200914@qq.com
 * @LastEditTime: 2022-12-19 12:52:04
 * @FilePath: \jk_sort_front\src\pages\QueryReport\ProductionBroad\index.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import { log } from 'console'
import moment from 'moment'
import { useEffect, useRef, useState } from 'react'

import { getServerTime } from '@/recoil/productionBroad/api'

import styles from './boardHead.module.less'

export default (props) => {
  const { title } = props
  const timmer = useRef<any>()
  const timeRef = useRef<any>()
  const [time, setTime] = useState(0)

  const [currentTime, setCurrentTime] = useState<string>(
    moment().format('YYYY.MM.DD HH:mm')
  )

  const getWeek = () => {
    return (
      '星期' +
      ['日', '一', '二', '三', '四', '五', '六'][moment(currentTime).weekday()]
    )
  }

  const getTime2 = () => {
    try {
      clearInterval(timeRef.current)
      const now = Date.now()
      setTime(+moment(now).format('ss'))
      const current = moment(now).format('YYYY.MM.DD HH:mm')
      setCurrentTime(current)
    } catch (err) {
      console.log(err)
    }
  }

  const getTime = async () => {
    try {
      const res = await getServerTime()
      clearInterval(timeRef.current)
      setTime(+moment(res.data).format('ss'))

      const current = moment(res.data).format('YYYY.MM.DD HH:mm')
      setCurrentTime(current)
    } catch (err) {
      console.log(err)
    }
  }

  useEffect(() => {
    const t = setTimeout(() => {
      getTime2()
    }, 1000)
    return () => {
      clearInterval(t)
    }
  }, [time])

  useEffect(() => {
    // clearInterval(timeRef.current)
    // timeRef.current = setInterval(() => {
    //   const nextTime = time + 1
    //   if (nextTime >= 60) {
    //     getTime()
    //     return
    //   }
    //   setTime(nextTime)
    // }, 1000)
  }, [time])

  useEffect(() => {
    // getTime()
    // timmer.current = setInterval(getTime, 30000)
    // return () => {
    //   clearTimeout(timmer.current)
    // }
  }, [])

  return (
    <div className={styles.container}>
      <div className={styles.headBg}>
        <div className={styles.headerTitle2}>{title}</div>
        <div className={styles.time2}>
          <span className={styles.timeSpan2}>{currentTime}</span>
          <span className={styles.timeSpan2}>{getWeek()}</span>
        </div>
      </div>

      {/* <header className={styles.broadHeader}>
        <img src={jackLogo} className={styles.logo} alt={''} />
        <div className={styles.headerTitle}>{title}</div>
        <div className={styles.time}>
          <span className={styles.timeSpan}>{currentTime}</span>
          <span className={styles.timeSpan}>{getWeek()}</span>
        </div>
      </header> */}
    </div>
  )
}
